<template>
    <view>
        <cu-custom bgColor="bg-gradual-green" :isBack="true">
            <block slot="backText">返回</block>
            <block slot="content">个人信息</block>
        </cu-custom>

        <view class="cu-bar bg-white solid-bottom margin-top">
            <view class="action">
                <text class="cuIcon-titles text-green"></text> 账号信息
            </view>
            <view class="action">
                <button class="cu-btn bg-green shadow" @click="modifyname">修改</button>
            </view>
        </view>
        <view class="cu-list menu" :class="[menuBorder?'sm-border':'',menuCard?'card-menu margin-top':'']">
            <view class="cu-item">
                <view class="content">
                    <text class="text-grey">头像：</text>
                    <view class="cu-avatar xl round margin-left"
                        :style="'background-image:url(' + currentUser.avatar + ');'"/>
                </view>
            </view>
            <view class="cu-item">
                <view>
                    <text class="text-grey">昵称：</text>
                    <text class="text-black">{{currentUser.username}}</text>
                </view>
            </view>
        </view>

        <view class="cu-bar bg-white solid-bottom margin-top">
            <view class="action">
                <text class="cuIcon-titles text-green"></text> 收件信息
            </view>
            <view class="action">
                <button class="cu-btn bg-green shadow" @click="modifyadd">修改</button>
            </view>
        </view>
        <view class="cu-list menu" :class="[menuBorder?'sm-border':'',menuCard?'card-menu margin-top':'']">
            <view class="cu-item">
                <view class="content">
                    <text class="text-grey">姓名：</text>
                    <text class="text-black">{{address.name}}</text>
                </view>
            </view>
            <view class="cu-item">
                <view class="content">
                    <text class="text-grey">电话：</text>
                    <text class="text-black">{{address.phone}}</text>
                </view>
            </view>
            <view class="cu-item">
                <view class="content">
                    <text class="text-grey">省份：</text>
                    <text class="text-black">{{address.province}}</text>
                </view>
            </view>
            <view class="cu-item">
                <view class="content">
                    <text class="text-grey">城市：</text>
                    <text class="text-black">{{address.city}}</text>
                </view>
            </view>
            <view class="cu-item">
                <view class="content">
                    <text class="text-grey">地区：</text>
                    <text class="text-black">{{address.district}}</text>
                </view>
            </view>
            <view class="cu-item">
                <view class="content">
                    <text class="text-grey">详细地址：</text>
                    <text class="text-black">{{address.detail}}</text>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
import {USER_API} from '@/API.js';
export default {
    data() {
        return {
            currentUser: {
                'uuid': 'uuid',
                'username': '',
                'avatar': ''
            },
            address: {
                'name': '',
                'phone': '',
                'province': '',
                'city': '',
                'district': '',
                'detail': ''
            }
        };
    },
    onShow() {
        console.log('personalInfo.vue: onshow');

        uni.request({
            url: USER_API.user.url,
            method: USER_API.user.method,
            header: {'http-token': this.getToken()},
            success: function(res) {
                console.log('账号信息获取成功');
                this.currentUser = res.data;
            }.bind(this)
        });
        uni.request({
            url: USER_API.userAddress.url,
            method: USER_API.userAddress.method,
            header: {'http-token': this.getToken()},
            success: function(res) {
                console.log('收件信息获取成功');
                this.address = res.data;
            }.bind(this)
        });
    },
    methods: {
        modifyadd: function() {
            uni.navigateTo({
                url: 'upload/modifyAddress',
                success: function() { console.log('ok'); },
                fail: function() { console.log('fail'); },
                complete: function() {}
            });
        },
        modifyname: function() {
            uni.navigateTo({
                url: 'upload/modifyName',
                success: function() { console.log('ok'); },
                fail: function() { console.log('fail'); },
                complete: function() {}
            });
        }
    }
};
</script>

<style>
</style>
